@extends('Admin.Layouts.layout')
@section('title','后台管理系统')
@section('style')
    <style>

    </style>
@endsection
@section('content')
    <div class="lyl-content">
        <div class="am-cf admin-main2">
            <div class="admin-content">
                <div class="admin-content-body">

                    <div class="am-cf am-padding">
                        <ol class="am-breadcrumb">
                            <li><a href="{{ url("admin/center/index") }}" class="am-icon-home">首页</a></li>
                            <li class="am-active">管理员管理</li>

                            <div class="am-fr am-cr">
                                <a class="am-btn am-btn-warning am-btn-xs" href="javascript:location.replace(location.href);">
                                    <i class="am-icon-refresh"></i>
                                </a>
                            </div>
                        </ol>
                    </div>

                    <div class="am-g am-animation-slide-right">
                        <div class="am-u-sm-12">
                            <div class="am-padding">
                                <a class="am-btn am-btn-success am-btn-xs" v-on:click="add">
                                    新增
                                </a>
                            </div>
                        </div>

                        <div class="am-u-sm-12">
                            <table class="am-table am-table-striped am-table-hover table-main">
                                <thead>
                                    <tr>
                                        <th>ID</th>
                                        <th>权限组名</th>
                                        <th>用户名</th>
                                        <th>创建时间</th>
                                        <th>操作</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <template v-for="(item,index) in list">
                                        <tr>
                                            <td>@{{ index+1 }}</td>
                                            <td>@{{ item.has_one_admin_group.title }}</td>
                                            <td>@{{ item.username }}</td>
                                            <td>@{{ item.create_time }}</td>
                                            <td>
                                                <div class="am-btn-group">
                                                    <a class="am-btn am-btn-xs am-btn-secondary" v-on:click="edit(item.admin_id)">编辑</a>
                                                    <a class="am-btn am-btn-xs am-btn-danger" v-on:click="del(item.admin_id)"> 删除</a>
                                                </div>
                                            </td>
                                        </tr>
                                    </template>
                                </tbody>
                            </table>
                        </div>
                    </div>



                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')
    <script>
        var vm = new Vue({
            el:'.lyl-content', //挂载点：主体页面
            data:{
                list:{!! $data !!}
            },
            methods: {
                add:function(){
                    layer.open({
                        type: 2,
                        title: '新增管理员',
                        shadeClose: true,//开启遮罩关闭
                        shade: 0.8,
                        area: ['100%', '100%'], //宽高
                        content: '{{ url("admin/admin/add") }}' //iframe的url
                    });
                },
                edit:function(id){
                    layer.open({
                        type: 2,
                        title: '修改管理员',
                        shadeClose: true,//开启遮罩关闭
                        shade: 0.8,
                        area: ['100%', '100%'], //宽高
                        content: '{{ url("admin/admin/edit") }}?id='+id //iframe的url
                    });
                },
                del:function(id){
                    layer.msg('确定要删除？', {
                        time: 20000, //20s后自动关闭
                        btn: ['确定','取消'],
                        btn1:function(){
                            $.get("{{ url("admin/admin/del") }}",{"id":id},function (data) {
                                if(data['status'] == "200"){
                                    layer.msg(data['text'],{icon:1,time:1000},function () {
                                        window.location.reload();
                                    })
                                }else{
                                    layer.msg(data['text'],{icon:2,time:1000});
                                }
                            });

                        }
                    });
                }
            }
        })
    </script>
@endsection